<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
</head>
<body>
    <div id="app">
        <span>{{str}}</span>
        <h1>{{method()}}</h1>

    </div>


    <script>
       //创建vue框架提供的vue对象
        let vueApp=Vue.createApp({
             setup() {
                //写js的代码
                 let str='hello vue3';
                 let a=100;

                 function method(){
                    return "hello vue3!!!";
                 }

                return{ //相当于 export (把变量,对象,方法...在return json结构中进行注册,在页面中就可以被调用了)
                     str,a,method
                }
             }
        })
       //vue对象管理操作 页面的标签 div -> vue对象和页面的内容进行挂载
       vueApp.mount("#app"); 
    </script>
</body>
</html>